浏览器渲染原理 - 页面加载过程

在浏览器中输入URL按下回车后发生了什么?

1
2
3
4
浏览器是怎么通知到服务端的? 
服务端是如何响应的?
页面又是如何渲染出来的?
在渲染页面的过程中有哪些可以优化的操作?

 

浏览器的渲染流程

  1. 浏览器会开启一个线程来处理页面请求.

  2. 浏览器检查本地缓存,如果缓存可用,则直接跳到第6步,否则进行第三步.

  3. 浏览器向操作系统请求服务器的IP地址(运营商根据网址向DNS服务器查询IP地址,并返回给操作系统.操作系统返回给浏览器)

  4. 浏览器向此IP发送请求, 启动与服务器的TCP连接,进行协议会话,三次握手等.

  5. 服务器网页容器(Nginx/Apache)的侦听端口接收到请求,返回容器中映射的网页文件给浏览器.

  6. 浏览器接收到HTTP响应,检查本地缓存是否有对应资源,根据响应的状态码不同,做出对应的处理. 看到4xx和5xx开头的状态码即表示出错.

  7. 浏览器将接收到的HTML, CSS, JS缓存起来,并渲染成页面.

 

参考文章

https://zhuanlan.zhihu.com/p/32333465

-------------本文结束 感谢您的阅读-------------